<template>
  <div class="packet-push-main " :style="`min-height: ${pageMinHeight}px`">
    <div
      v-if="$route.path==='/packetPush/versionManagement'"
      class="p-version-box"
      :style="`width: calc(100% - ${sideMenuWidth})`"
    >

      <a-breadcrumb>
        <a-breadcrumb-item>
          <router-link :to="{name:'资源工具'}">
            资源工具
          </router-link>
        </a-breadcrumb-item>
        <a-breadcrumb-item>报文推送控制台</a-breadcrumb-item>
        <a-breadcrumb-item>
          报文配置
        </a-breadcrumb-item>
        <a-breadcrumb-item>
          <router-link :to="{name:'模板管理'}">
            模板管理
          </router-link>
        </a-breadcrumb-item>
        <a-breadcrumb-item>版本管理</a-breadcrumb-item>
      </a-breadcrumb>
      <div class="fs-16 fw-b mt-8 text-color-21252e">
        报文推送控制台
      </div>
    </div>
    <div
      class="d-flex"
      :style="{'margin-top':$route.path==='/packetPush/versionManagement'?'57px':'0px','height':$route.path==='/packetPush/versionManagement'?'calc(100% - 57px)':'100%'}"
    >
      <div class="d-flex flex-column pp-menu-list">
        <div class="pp-menu-list-item pp-menu-list-title">报文配置</div>
        <div
          v-for="item in treeData"
          :key="item.name"

          class=""
          :class="['pp-menu-list-item',item.name===activeName?'pp-menu-list-item-active':'']"
          @click="onClick(item.name)"
        >

          {{ item.name }}
        </div>
      </div>
      <router-view class="packet-page flex-1 ml-16" />
    </div>

  </div>
</template>

<script>
import {
  packetPush
  // sendAMessage,
  // automaticTransceivewrPacketStatistics
} from '@/router/config';
import { mapState, mapGetters } from 'vuex';
packetPush.children[0]['disabled'] = true;
// sendAMessage.children[0]['disabled'] = true;
// automaticTransceiverPacketStatistics.children[0]['disabled'] = true;

const treeData = Object.freeze(
  packetPush.children[0].children
  // ...sendAMessage.children,
  // ...automaticTransceiverPacketStatistics.children
);

export default {
  data() {
    return {
      activeName: '一级分类管理',
      selectedKeys: [],
      treeData
    };
  },
  computed: {
    ...mapState('setting', ['pageMinHeight']),
    ...mapGetters('setting', ['sideMenuWidth'])
  },
  mounted() {
    this.activeName = this.$route.name;
  },
  methods: {
    onClick(name) {
      this.activeName = name;

      this.$router.push({ name: name });
    }
  }
};
</script>

<style lang="less">
@import 'index.less';
</style>
